// https://juejin.cn/post/7246283990112960572
// bem架构 由 b：block（-）、e：element（__）、m：modifier（--）组成
// 参考elementUI的 块级类名：el-input、元素类名：el-input__inner、标识类名：el-button--success

// !default 表示这个变量如果没有赋过别的值，默认为 common
$namespace: 'lp' !default;
$block-sel: "-" !default;
$elem-sel: "__" !default;
$mod-sel: "--" !default;

@mixin bfc() {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

@mixin b($block) {
  $B: #{$namespace + $block-sel + $block};
  .#{$B} {
    @content;
  }
}

@mixin e($el) {
  $selector: &;
  @at-root {
    #{$selector + $elem-sel + $el} {
      @content;
    }
  }
}

@mixin m($m) {
  $selector: &;
  @at-root {
    #{$selector + $mod-sel + $m} {
      @content;
    }
  }
}